<template>
  <div>
    <div class="container2_out">
      <div class="container2_card-list">
        <div class="container2_card-list_wrap">
          <div class="container2_card-item" style="background-color: #4169E1;">
            <img src="https://file.mbadashi.com/image/20210511100240576_641X371.png" alt="课程封面图" class="container2_course-img">
          </div>
          <div class="container2_course-info">
            <div class="container2_course-title">2022跟学团（6月1期）</div>
            <div class="container2_course-subtitle">本期开课时间：6月7日</div>
            <div class="container2_card-bottom">
              <div>
                <p class="buy-cnt">
                  8850人已购买
                </p>
              </div>
              <div class="course-label-price">
                <h3 class="container2_sale-money">
                  ¥4998
                </h3>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="container2_card-list">
        <div class="container2_card-list_wrap">
          <div class="container2_card-item" style="background-color: #4169E1;">
            <img src="https://file.mbadashi.com/image/20210511100240576_641X371.png" alt="课程封面图" class="container2_course-img">
          </div>
          <div class="container2_course-info">
            <div class="container2_course-title">2022跟学团（6月1期）</div>
            <div class="container2_course-subtitle">本期开课时间：6月7日</div>
            <div class="container2_card-bottom">
              <div>
                <p class="buy-cnt">
                  8850人已购买
                </p>
              </div>
              <div class="course-label-price">
                <h3 class="container2_sale-money">
                  ¥4998
                </h3>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="container2_card-list">
        <div class="container2_card-list_wrap">
          <div class="container2_card-item" style="background-color: #4169E1;">
            <img src="https://file.mbadashi.com/image/20210511100240576_641X371.png" alt="课程封面图" class="container2_course-img">
          </div>
          <div class="container2_course-info">
            <div class="container2_course-title">2022跟学团（6月1期）</div>
            <div class="container2_course-subtitle">本期开课时间：6月7日</div>
            <div class="container2_card-bottom">
              <div>
                <p class="buy-cnt">
                  8850人已购买
                </p>
              </div>
              <div class="course-label-price">
                <h3 class="container2_sale-money">
                  ¥4998
                </h3>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="container2_card-list">
        <div class="container2_card-list_wrap">
          <div class="container2_card-item" style="background-color: #4169E1;">
            <img src="https://file.mbadashi.com/image/20210511100240576_641X371.png" alt="课程封面图" class="container2_course-img">
          </div>
          <div class="container2_course-info">
            <div class="container2_course-title">2022跟学团（6月1期）</div>
            <div class="container2_course-subtitle">本期开课时间：6月7日</div>
            <div class="container2_card-bottom">
              <div>
                <p class="buy-cnt">
                  8850人已购买
                </p>
              </div>
              <div class="course-label-price">
                <h3 class="container2_sale-money">
                  ¥4998
                </h3>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    name: "live",

    data() {
      return {


      }
    }

  }
</script>
<style scoped>
.container2_out {
    display: flex;
    flex-wrap: wrap;
  }

  .container2_card-list {
    display: flex;
    /* 	background-color: aliceblue; */
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
  }

  .container2_card-list_wrap {
    display: flex;
    background-color: ghostwhite;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 0px;
  }

  .container2_course-info {
    width: 330px;
    margin-left: 10px;

  }

  .container2_course-title {
    font-size: 20px;
    font-weight: bolder;
  }

  .container2_course-img {
    width: 250px;
    height: 180px;
    border-radius: 3%;
  }

  .container2_card-item {}

  .container2_card-bottom {
    margin-top: 100px;
    display: flex;
  }

  .container2_course-subtitle {
    margin-top: 10px;
  }

  .container2_buy-cnt {
    font-size: 15px;
  }

  .container2_sale-money {
    color: #FF6600;
    font-size: 20px;
    margin-left: 150px;
  }

</style>
